
//==========登录注册页面切换==========
$("#showReg").on("click", function () {
  $(".reg-form ").show()
  $(".login-form ").hide()
})
$("#showLogin").on("click", function () {
  $(".reg-form ").hide()
  $(".login-form ").show()
})

//注意：要使用form.verify方法来做表单的校验，要处理好form，就是从layui.form中获取到的
const form = layui.form
//==========自定义校验规则============
form.verify({
  //我们既支持上述函数式的方式，也支持下述数组的形式
  //数组的两个值分别代表：[正则匹配、匹配不符时的提示文字]
  pwd: [/^[\S]{6,12}$/, "密码必须6到12位，且不能出现空格"],

  rePwd: function (value, item) {
    //value：表单的值、item：表单的DOM对象
    let pwdVal = $("#pwdInp").val()
    if (pwdVal !== value) {
      return "俩次输入的密码不一致"
    }
  },
})

//============axios请求实现注册功能==============
let layer = layui.layer
$(".reg-form").on("submit", function (e) {
  e.preventDefault()
  //jq中的快速获取表单中的数据serialize()方法，必须要加name属性的值，若不写，则响应的数据是空
  let data = $(this).serialize()
  axios
    .post("/api/reguser", data)
    .then(({ data }) => {
      console.log(data)
      if (data.status !== 0) { return layer.msg(data.message) }
      layer.msg('注册成功')
      //去登录
      $("#showLogin").click()
    })
})

//==============登录页面================
$(".login-form ").on('submit', function (e) {
  e.preventDefault()
  const data = $(this).serialize()
  axios.post('/api/login', data).then(({ data: { status, message, token } }) => {
    if (status !== 0) {
      return layer.msg(message)
    }
    //登录成功，需要处理token（本地存储）token  注意书写位置在登录成功之后跳转之前
    localStorage.setItem('token', token)
    //下面这样写的话登录时看不到弹框，会立即跳转到登录页
    //layer.msg(message)
    //location.href = '/index.html'
    //解决以上问题
    layer.msg('登录成功，即将跳转到登录首页', {
      icon: 1,
      time: 2000 //2秒关闭（如果不配置，默认是3秒）
    }, function () {
      //do something
      location.href = '/index.html'//  /表示根路径，只能在服务器环境（live seriver)打开才行，否则会报错
    });
  })
})